<!-- eslint-disable vue/multi-word-component-names -->
// eslint-disable-next-line vue/multi-word-component-names
<template>
    <div class="bigbox">
        <div class="box1">
            <div>
                <h1>登录</h1>
                <form>
                    <label for="username"><sup>*</sup>用户名:</label>
                    <input type="text" id="username" v-model="username" />
                    <br />
                    <br />
                    <label for="password"><sup>*</sup>密码:</label>
                    <input type="password" id="password" v-model="password" />
                    <br />
                    <br />
                    <button type="submit" @click.prevent="login">登录</button>
                </form>
                <br />
                <br />
                <h1>注册</h1>
                <form>
                    <label for="new-username"><sup>*</sup>用户名:</label>
                    <input type="text" id="new-username" v-model="newUsername" />
                    <br />
                    <br />
                    <label for="new-password"><sup>*</sup>密码:</label>
                    <input type="password" id="new-password" v-model="newPassword" />
                    <br />
                    <br />
                    <label for="confirm-password"><sup>*</sup>确认密码:</label>
                    <input type="password" id="confirm-password" v-model="confirmPassword" />
                    <br />
                    <br />
                    <button type="submit" @click.prevent="register">注册</button>
                </form>
            </div>
        </div>
    </div>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      password: '',
      newUsername: '',
      newPassword: '',
      confirmPassword: '',
    };
  },
  methods: {
    login() {
      // 在这里编写登录的逻辑
    },
    register() {
      // 在这里编写注册的逻辑
    },
  },
};
</script>

<style>
.bigbox {
    background-color: aqua;
}
.box1 {
    width: 500px;
    margin: 50px auto;
    padding: 20px;
    border: 1px solid #9c3535;
    background-color: #a23b3b;
    text-align: center;
    background-image: url('D:\web源码\Element UI\bnaqi1\src\assets\登录.png');
}
</style>
